import { registerMicroApps, start, addGlobalUncaughtErrorHandler } from 'qiankun'

export const useQiankun = () => {
  const apps = [
    {
      name: '@tools/demo1', // 必选，微应用的名称，微应用之间必须确保唯一
      entry: 'http://localhost:5174', // - 必选，微应用的入口
      container: '#app1Container', // -必选，微应用的容器节点的选择器或者 Element 实例
      activeRule: '/', // - 必选，微应用的激活规则
      props: {
        // - 可选，主应用需要传递给微应用的数据。
        parentStore: '11111',
        msg: '我是父应用传过来的值，传递给demo1应用'
      }
    },
    {
      name: '@tools/demo2', // 必选，微应用的名称，微应用之间必须确保唯一
      entry: 'http://localhost:5175', // - 必选，微应用的入口
      container: '#app2Container', // -必选，微应用的容器节点的选择器或者 Element 实例
      activeRule: '/', // - 必选，微应用的激活规则
      props: {
        // - 可选，主应用需要传递给微应用的数据。
        parentStore: '11111',
        msg: '我是父应用传过来的值，传递给demo2应用'
      }
    },
    {
      name: '@tools/demo3', // 必选，微应用的名称，微应用之间必须确保唯一
      entry: 'http://localhost:5176', // - 必选，微应用的入口
      container: '#app3Container', // -必选，微应用的容器节点的选择器或者 Element 实例
      activeRule: '/', // - 必选，微应用的激活规则
      props: {
        // - 可选，主应用需要传递给微应用的数据。
        parentStore: '11111',
        msg: '我是父应用传过来的值，传递给demo3应用'
      }
    }
  ]

  registerMicroApps(apps, {
    beforeLoad: (app) => {
      // 加载微应用前，加载进度条
      console.log('before load', app.name)
      return Promise.resolve()
    },
    afterMount: (app) => {
      // 加载微应用前，进度条加载完成
      console.log('after mount', app.name)
      return Promise.resolve()
    }
  })

  addGlobalUncaughtErrorHandler(err => {
    console.error(err)
    const { message } = err
    // 加载失败时提示
    if (message && message.includes('died in status LOADING_SOURCE_CODE')) {
      console.error('微应用加载失败，请检查应用是否可运行')
    }
  })

  start({
    sandbox: {
      // strictStyleIsolation: true,
      experimentalStyleIsolation: true
    }
  })
}
